<template>
    <div class="detail_container">
        <div class="mui-card" style="width: 320px;margin: 15px auto;" v-for='item in data' :key='item.course.id'>
			<div class="mui-card-header mui-card-media">
				<img :src="item.teacher.head_thumb">
				<div class="mui-media-body">
					{{ item.teacher.user_name }}
					<p>发表于 {{ item.course.add_time | dateFormat }}</p>
				</div>
			</div>
			<div class="mui-card-content">
				<img :src="item.course.image_src_show" alt="" width="100%">
			</div>
			<div class="mui-card-footer">
				<a class="mui-card-link">Like</a>
				<a class="mui-card-link">Comment</a>
				<a class="mui-card-link">Read more</a>
			</div>
		</div>
        <!-- 评论模块. -->
        <comment-con :id='$route.params.id'></comment-con>
    </div>
</template>

<script>
import comment from "./comment.vue";
export default {
        provide(){
            return {
                add: this.add
            }
        },
        data() {
            return {
                data: null,
                
            };
        },
        components: {
            "comment-con": comment
        },
        created() {
            console.log(this.$route.params.id);
            this.getlist();
        },
        methods: {
            getlist() {
                this.axios
                .post("/api/recommend/Recommend/recommend", {
                    page: this.$route.params.id
                })
                .then(({ data }) => {
                    console.log(data);
                    this.data = data.course;
                });
            },
            
        }
    };
</script>

<style scoped>
</style>